<template>
  <div class="doctorregister">
    <div class="container">
      <!-- 头部信息 -->
      <header>
        <Row>
          <Col :xs="24">
            <div class="margin-up-down">
              <Button type="primary" @click="addDoctor" class="addButton">
                <i
                  class="iconfont icon-add"
                  style="font-size: 14px; margin-right: 5px"
                ></i>
              </Button>
            </div>
            <div class="margin-up-down">
              <fourLevelLinkage
                @changeProvince="changeProvince"
                @changeCity="changeCity"
                @changeArea="changeArea"
                @changeHospital="changeHospital"
                :province="province"
                :city="city"
                :area="area"
                :hospital="hospital"
                :hospitalType="1"
              ></fourLevelLinkage>
            </div>
            <div class="margin-up-down">
              <Input
                v-model.trim="Name"
                placeholder="输入医生姓名/联系方式/医院名称进行查询"
                style="width: 260px"
                clearable
              />
            </div>
            <div class="margin-up-down">
              <Select
                class="w-select"
                placeholder="职称级别"
                clearable
                v-model="dcotorTitle"
                style="width: 100px"
              >
                <Option
                  v-for="item in titleList"
                  :value="item.dictType"
                  :key="item.dictType"
                  style="text-align: center"
                  >{{ item.dictName }}</Option
                >
              </Select>
            </div>
            <div class="margin-up-down">
              <Button
                type="primary"
                icon="ios-search"
                @click="getDoctorData(1)"
                style="width: 51px; height: 35px"
              ></Button>
              <Button @click="handleReset()" style="width: 51px; height: 35px">
                <i
                  class="iconfont icon-gengxin"
                  style="font-size: 14px; margin-right: 5px"
                ></i>
              </Button>
              <Button type="primary" @click="branch">批量导入</Button>
            </div>
          </Col>
        </Row>
      </header>
      <!-- 列表 -->
      <div class="list">
        <Table
          @on-selection-change="selectChange"
          :loading="tableLoading"
          border
          stripe
          :columns="columns1"
          :data="list"
        ></Table>
      </div>
    </div>
    <!--分页器-->
    <div class="page">
      <Page
        :total="doctorregisterSize"
        :current="pageNo"
        :page-size="pageSize"
        show-total
        show-elevator
        @on-change="pageChange"
      />
    </div>
    <Modal v-model="modal1" title="预览信息" footer-hide>
      <p class="modal_p">{{ path }}</p>
    </Modal>
    <!-- 删除确认弹窗 -->
    <Modal
      v-model="showDelModal"
      title="确认删除弹窗"
      class="drugmanagement-commondrug-list-delModal"
    >
      <p>删除后不可恢复，确认删除所选项吗？</p>
      <div slot="footer">
        <Button class="cancel-btn btn" @click="showDelModal = false"
          >取消</Button
        >
        <Button
          class="save-btn btn"
          type="primary"
          :loading="delLoading"
          @click="handleDel"
          >确认</Button
        >
      </div>
    </Modal>
    <!--CA绑定弹框-->
    <BindCaModalCom ref="bindCaModal" @success="handleReset" />

    <!--CA解绑弹框-->
    <UnBindCaModalCom ref="unBindCaModal" @success="handleReset" />
  </div>
</template>
<script>
// 医生注册信息
import cookie from "@/utils/cookie.js";
import api from "@/api/commonApi";
import fourLevelLinkage from "@/components/fourLevelLinkage";
import BindCaModalCom from "./components/BindCaModalCom.vue";
import UnBindCaModalCom from "./components/UnbindCaModalCom.vue";

export default {
  components: {
    fourLevelLinkage,
    BindCaModalCom,
    UnBindCaModalCom,
  },
  data() {
    return {
      tableLoading: false,
      province: null,
      city: null,
      area: null,
      hospital: null,
      selections: [],
      doctorregisterSize: 0,
      list: [],
      Name: "",
      pageNo: 1,
      pageSize: 10,
      modal1: false,
      path: "",
      dcotorTitle: null, // 医生职称
      titleList: "",
      columns1: [
        {
          title: "排序",
          key: "sum",
          width: 80,
          align: "center",
          render: (h, params) => {
            let sum = (this.pageNo - 1) * this.pageSize + params.index + 1;
            return h("span", sum);
          },
        },
        { title: "机构", key: "hospitalName", align: "center" },
        { title: "科室", key: "departmentName", align: "center" },
        { title: "职称", key: "titleName", align: "center" },
        { title: "姓名", key: "name", align: "center" },
        {
          title: "性别",
          key: "gender",
          align: "center",
          render(h, params) {
            return ["", "男", "女"][params.row.gender];
          },
        },
        {
          title: "身份证号",
          key: "idcard",
          align: "center",
          render: (h, params) => {
            if (params.row.idcard) {
              // let idcard = String(params.row.idcard).replace(/(\d{6})\d{8}(\d{4})/g,'$1********$2');
              // return idcard
              var str1 = params.row.idcard.slice(0, 6);
              var str2 = "";
              var str3 = params.row.idcard.slice(14);
              if (params.row.idcard.length == 15) {
                str2 = "*****";
              } else {
                str2 = "********";
              }
              let idcard = str1 + str2 + str3;
              return idcard;
            }
          },
        },
        {
          title: "手机号",
          key: "phone",
          align: "center",
          render: (h, params) => {
            if (params.row.idcard) {
              let phone = params.row.phone.replace(
                /^(.{3})(?:\w+)(.{4})$/,
                "$1****$2"
              );
              return phone;
            }
          },
        },
        {
          title: "设置",
          key: "iOperate",
          width: 200,
          align: "center",
          render: (h, params) => {
            let row = params.row;
            return h("div", [
              !params.row.wyAccid
                ? h(
                    "span",
                    {
                      props: {
                        type: "primary",
                        size: "small",
                      },
                      style: {
                        color: "#21c780",
                        margin: "0px 6px",
                      },
                      on: {
                        click: () => {
                          this.handleEdit(row);
                        },
                      },
                    },
                    "编辑"
                  )
                : null,
              h(
                "span",
                {
                  props: {
                    size: "small",
                  },
                  style: {
                    color: "#5362e1",
                    margin: "0px 6px",
                  },
                  on: {
                    click: () => {
                      this.handleReview(row);
                    },
                  },
                },
                "详情"
              ),
              h(
                "span",
                {
                  props: {
                    size: "small",
                  },
                  style: {
                    color: "#FFCC33",
                    margin: "0px 6px",
                  },
                  on: {
                    click: () => {
                      if (row.caOid) {
                        this.onUnBindCaAccount(row);
                      } else {
                        this.onBindCaAccount(row);
                      }
                    },
                  },
                },
                "CA"
              ),
              !params.row.wyAccid
                ? h(
                    "span",
                    {
                      props: {
                        type: "error",
                        size: "small",
                      },
                      style: {
                        color: "#fc6c49",
                        marginLeft: "6px",
                      },
                      on: {
                        click: () => {
                          this.handleRemove(row);
                        },
                      },
                    },
                    "删除"
                  )
                : null,
            ]);
          },
        },
      ],
      data1: [],
      showDelModal: false,
      delLoading: false,
      delType: null, // single batch
      curRecord: null,
      type: 1,
    };
  },
  created() {
    this.type = this.$route.query.type ? this.$route.query.type : 1;
    let breadList = [
      { path: "/index", title: "首页" },
      {
        path: "/index/maintain/indexManagement/index",
        title: "索引管理",
      },
      {
        path: "/index/doctorOperation/doctorregister/list",
        title: "医生注册信息",
      },
    ];
    this.$emit("changeBreadList", breadList);
  },
  mounted() {
    let pageNo = this.$route.query.pageNo;
    if (pageNo) {
      this.pageNo = pageNo;
    }
    this.getTitleList();
    this.getDoctorData(this.pageNo);
  },
  methods: {
    onBindCaAccount(e) {
      this.$refs.bindCaModal.show(e);
    },
    onUnBindCaAccount(e) {
      console.log(this.$refs.unBindCaModal);
      this.$refs.unBindCaModal.show(e);
    },
    // 批量导入
    branch() {
      this.functionJS.queryNavgationTo(
        this,
        "/index/doctorOperation/doctorregister/batchone",
        {
          pageNo: this.pageNo,
        }
      );
    },
    getTitleList() {
      this.$axios
        .post(api.findDoctorTitleListByDoctorType, { type: this.type })
        .then((resp) => {
          this.titleList = resp.data.object;
        })
        .catch((err) => {
          console.log(err);
        });
    },
    changeProvince(val) {
      this.province = val;
    },
    changeCity(val) {
      this.city = val;
    },
    changeArea(val) {
      this.area = val;
    },
    changeHospital(val) {
      this.hospital = val;
    },
    selectChange(selections) {
      this.selections = selections;
    },
    handleReset() {
      this.pageNo = 1;
      this.pageSize = 10;
      if (
        cookie.getCookie("idtt") === "2" ||
        cookie.getCookie("idtt") === "3"
      ) {
      } else {
        this.province = null;
        this.city = null;
      }
      this.area = null;
      this.Name = "";
      this.hospital = null;
      this.dcotorTitle = null;
      this.getDoctorData(this.pageNo);
    },
    handleEdit(item) {
      this.functionJS.queryNavgationTo(
        this,
        "/index/doctorOperation/doctorregister/edit",
        {
          pageNo: this.pageNo,
          id: item.id,
          // type: this.type,
        }
      );
    },
    handleRemove(record) {
      this.delType = "single";
      this.showDelModal = true;
      this.curRecord = record;
    },
    handleDel() {
      if (this.delType === "single") {
        this.delByDoctorIds([this.curRecord.id]);
      } else if (this.delType === "batch") {
        if (!this.selections.length) {
          this.$Message.info("请勾选删除项");
          return false;
        }
        this.delByDoctorIds(this.selections.map((item) => item.id));
      }
    },
    handleReview(item) {
      this.functionJS.queryNavgationTo(
        this,
        "/index/doctorOperation/doctorregister/review",
        {
          pageNo: this.pageNo,
          id: item.id,
          // type: this.type,
        }
      );
    },
    addDoctor() {
      this.functionJS.queryNavgationTo(
        this,
        "/index/doctorOperation/doctorregister/add",
        {
          pageNo: this.pageNo,
          type: this.type,
        }
      );
    },
    // 分页
    pageChange(index) {
      this.getDoctorData(index);
    },
    // 显示简介
    simple(item) {
      if (!Boolean(item.personalIntroduction)) {
        this.$Message.info("暂无医生简介");
        return "";
      }
      this.modal1 = true;
      this.path = item.personalIntroduction;
    },
    // 显示特长
    simples(item) {
      if (!Boolean(item.doctorGood)) {
        this.$Message.info("暂无医生特长");
        return "";
      }
      this.modal1 = true;
      this.path = item.doctorGood;
    },
    delByDoctorIds(idArr) {
      this.delLoading = true;
      this.$axios
        .post(api.delByDoctorIds, idArr)
        .then((res) => {
          if (res.data.code === 1) {
            this.$Message.success("删除成功");
            this.getDoctorData();
            this.showDelModal = false;
          } else {
            this.$Modal.error({
              content: res.data.object
                .map((item) => `<p>${item}</p>`)
                .join("<br />"),
              okText: "确认",
              onOk: () => {
                this.showDelModal = false;
              },
            });
            this.$Message.info(res.data.message);
          }
          this.delLoading = false;
        })
        .catch(() => {
          let err = res.data.object;
          this.delLoading = false;
          this.$Message.error(err);
        });
    },
    // 获取页面数据
    getDoctorData(pageNo) {
      if (pageNo) {
        this.pageNo = Number(pageNo);
      }
      let params = {
        pageNo: this.pageNo,
        pageSize: this.pageSize,
        type: this.type,
      };
      if (this.Name != "") {
        params.searchKey = this.Name.trim();
      }
      params.provinceCode = this.province ? this.province : null;
      params.cityCode = this.city ? this.city : null;
      params.areaCode = this.area ? this.area : null;
      params.hospitalId = this.hospital ? this.hospital : null;
      params.title = this.dcotorTitle ? this.dcotorTitle : null;
      //获取父级科室
      let department = cookie.getCookie("department") || "";
      params.department = department;
      this.tableLoading = true;
      this.$axios
        .post(api.getDoctorInfo, params)
        .then((res) => {
          if (res.data.code) {
            let ret = res.data.object;
            this.doctorregisterSize = ret.total;
            let arr = ["个人注册", "批量导入", "平台注册"];
            if (ret.records) {
              ret.records.forEach((item, index) => {
                item.sum = this.addZeros(index);
                // item.gender = item.gender == "0" ? "女" : "男";
                item.ibatch = arr[item.ibatch];
              });
              this.list = ret.records;
            } else {
              this.list = [];
            }
          } else {
            this.$Message.info(res.data.message);
          }
          this.tableLoading = false;
        })
        .catch(() => {
          this.tableLoading = false;
        });
    },
  },
  watch: {
    pageSize(nv, ov) {
      this.getDoctorData(this.pageNo);
    },
  },
};
</script>
<style lang="less" scoped>
.doctorregister {
  padding: 10px;
  width: 100%;
  background: #ffffff;
  box-sizing: border-box;
  margin: 0 auto;
  .margin-up-down {
    display: inline-block;
    margin: 10px 0;
  }
  .addButton {
    border: 1px solid #21c780;
    background-color: #21c780;
  }
  .container {
    width: 100%;
    margin: 0 auto;
    header {
      width: 100%;
      position: relative;
      .search {
        margin: 10px 0;
      }
    }
    .list {
      width: 100%;
      margin: 10px 0;
    }
  }
  .page {
    text-align: center;
  }
}
</style>
